<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
	<title>Cell Bank</title>
    <link rel="stylesheet" type="text/css" href="../../static/css/bootstrap.min.css">
    <link rel="stylesheet" type="text/css" href="../../static/css/common.css">
    <!-- <script type="text/javascript" src="../../static/js/jquery-3.3.1.min.js"></script> -->
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.js"></script>
    <script type="text/javascript" src="../../static/js/bootstrap/bootstrap.min.js"></script>
    <!-- <script type="text/javascript" src="../../static/js/bootstrap-paginator.js""></script> -->
    <script type="text/javascript" src="../../static/js/jquery.twbsPagination.min.js"></script>

    <link rel="stylesheet" type="text/css"  href="../../static/css/daterangepicker.css">
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.22.1/moment.min.js"></script>
    <script type="text/javascript" src="../../static/js/daterangepicker.js"></script>
<!--     <script type="text/javascript" src="./js/data-set.min.js"></script>
    <script type="text/javascript" src="./js/g2.min.js"></script> -->
</head>
<body>
<!--     <div class="container-fluid" id="main_container">

        <div class="row-fluid">
            <div class="span12">
                <div  >
                {% include 'header.html' %}
                <div id="content">{% block main %}{% endblock %}</div>                    
                </div>

            </div>
        </div>
        {% include 'footer.html' %}
    </div> -->
    <nav class="navbar navbar-expand-md navbar-dark " role="navigation">
        <a class="navbar-brand" href="/dapeng/"><h5>Cell Bank</h5></a>
        <div class="collapse navbar-collapse">
            <ul id="menu" class="navbar-nav mx-auto">
                <li class="nav-item" style="font-size:15px;"><a class="nav-link" href="/dapeng/list/request/">Requests </a></li>
                <li class="nav-item" style="font-size:15px;"><a class="nav-link" href="/dapeng/list/release/"> Releases </a></li>
                <li class="nav-item" style="font-size:15px;"><a class="nav-link" href="http://10.192.225.185/dpcm/mcu/monitor/">Stations</a></li>
                <li class="nav-item" style="font-size:15px;"><a class="nav-link" href="http://10.192.225.185/dpcm/mcu/platforms/">Platforms</a></li>
                <li class="nav-item" style="font-size:15px;"><a class="nav-link" href="/dapeng/list/compiler/">Compiler</a></li>
                <!-- <li class="nav-item" style="font-size:15px;"><a class="nav-link" href="/dapeng/list/debugger/">Debugger</a></li> -->
                <li class="nav-item" style="font-size:15px;"><a class="nav-link" href="http://10.192.225.185/dpcm/documentation/ "target="_blank">Documentation</a></li>
            </ul>
        </div>

        <a href="/dapeng/new/request/" class="btn btn-outline-primary btn-sm mr-2" role="button" aria-disabled="true">New</a>

        <!-- 
            <a href="/dapeng/login/" class="btn btn-outline-primary btn-sm" role="button" aria-disabled="true">Log-in</a>
         -->
    </nav>
    <div class="container-fluid" id="main-body">
        <div class="row">
            <div class="col-md-12">
                
                <form class="form-horizontal from-inline" id="form1" enctype="multipart/form-data" action="http://dapeng/dapeng/edit/request/0/" method="post" onkeydown="if(event.keyCode==13){return false;}" onsubmit="return false">
                    <input type="hidden" name="csrfmiddlewaretoken" value="qy9OUrTNo2dwoNYFXL4qvmBeBJqEaKxtAbT1rpN0CA7aYQDYs3Yalv7mwcSLvqdh">

                    <div class="d-flex flex-row justify-content-center mb-3 mt-4">
                        <div class="d-flex justify-content-center">
                            <div class="mx-1" style="width:180px;">
                                <label class="">Project</label>
                                <input class="form-control form-control-sm input-group-sm dapeng-input-filter" name="name" id="name" type="text">
                            </div>
                        
                            <div class="mx-1" style="width:180px;">
                                <label class="">Type</label>
                                <select class="form-control form-control-sm input-group-sm dapeng-select-filter" name="requesttype" id="requesttype" type="select"><option value=""></option><option value="1">Pool</option><option value="2">Clone</option><option value="3">Stabilit</option> </select>
                            </div>
                            <div class="mx-1" style="width:180px;">
                                <label> Date Range</label>
                                <input type="text" id="date_range" class="form-control form-control-sm input-group-sm dapeng-select-filter">
                            </div>
                            <div class="mx-1" style="width:180px;">
                                <label class="">Operator</label>
                                <select class="form-control form-control-sm input-group-sm dapeng-select-filter" name="systemid" id="systemid" type="select"><option value=""></option><option value="1">Windows</option><option value="2">Linux</option><option value="3">Mac</option></select>
                            </div>
                        </div>
                    </div>
                </form>
            </div>
        </div>
     </div>

   <script type="text/javascript">
      $(document).ready(function() {

        $('#date_range').focus(function(){
          updateConfig();
        });
        

        function updateConfig() {
          var options = {};

        
    
            options.timePicker = true;
          
          
            options.autoApply = true;

           
            options.ranges = {
              'Today': [moment(), moment()],
              'Yesterday': [moment().subtract(1, 'days'), moment().subtract(1, 'days')],
              'Last 7 Days': [moment().subtract(6, 'days'), moment()],
              'Last 30 Days': [moment().subtract(29, 'days'), moment()],
              'This Month': [moment().startOf('month'), moment().endOf('month')],
              'Last Month': [moment().subtract(1, 'month').startOf('month'), moment().subtract(1, 'month').endOf('month')]
            };
           

         

          $('#date_range').daterangepicker(options, function(start, end, label) { console.log('New date range selected: ' + start.format('YYYY-MM-DD') + ' to ' + end.format('YYYY-MM-DD') + ' (predefined range: ' + label + ')'); }).click();;
          
        }

      });
      </script>
      
</body>
</html>